<div class="user-guide">
    <div class="ui center aligned huge header">User-Input Guide</div>
    <div class="ui center aligned small header">
        Please check what is the "Correct Format"?
    </div>
    <div class="ui segments">
        <div class="ui segment">
            <div class="ui">
                <div class="ui header">
                    <i class="file image icon"></i>
                    <div class="content">
                        Logo Format
                    </div>
                </div>
            </div>
            <div class="ui bulleted list">
                <div class="item">The logo can be uploaded in two types.
                    <div class="ui bulleted list">
                        <div class="item">Image type logo</div>
                        <div class="item">Text type logo</div>
                    </div>
                </div>
                <div class="item">The image type logo allows you to upload any image as your logo provided it has
                    dimensions of size(width x height): 749 X 211px & Resolution: 300 DPI</div>
                <div class="item">The text type logo allows you to choose any text as your logo. You can also choose
                    text color and background color</div>
            </div>
        </div>
        <div class="ui segment">
            <div class="ui">
                <div class="ui header">
                    <i class="file excel icon"></i>
                    <div class="content">
                        CSV Format
                    </div>
                </div>
            </div>
            <div class="ui bulleted list">
                <div class="item">The CSV must be uploaded with 5 columns of data.</div>
                <div class="item">Five comma (',') seperated values should be present in the CSV</div>
                <div class="item">See Example Below</div>
                <table class="ui celled structured table">
                    <thead>
                        <tr>
                            <th rowspan="2">First Line</th>
                            <th rowspan="2">Second Line</th>
                            <th rowspan="2">Third Line</th>
                            <th rowspan="2">Fourth Line</th>
                            <th rowspan="2">Fifth Line</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <td>First Name</td>
                            <td>Last Name</td>
                            <td>Position</td>
                            <td>Organisation/Project</td>
                            <td>Social Handle</td>
                        </tr>
                        <tr>
                            <td>Deepjyoti</td>
                            <td>Mondal</td>
                            <td>Mentor</td>
                            <td>FOSSASIA</td>
                            <td>@djmgit</td>
                        </tr>
                        <tr>
                            <td>Yash</td>
                            <td>Ladha</td>
                            <td>Developer</td>
                            <td>Badgeyay</td>
                            <td>@yashladha</td>
                        </tr>
                        <tr>
                            <td>Manish</td>
                            <td>Devgan</td>
                            <td>Developer</td>
                            <td>Badgeyay</td>
                            <td>@gabru-md</td>
                        </tr>
                        <tr>
                            <td>Parth</td>
                            <td>Shandilya</td>
                            <td>Developer</td>
                            <td>Badgeyay</td>
                            <td>@ParthS007</td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
        <div class="ui segment">
            <div class="ui">
                <div class="ui header">
                    <i class="edit icon"></i>
                    <div class="content">
                        Manual Data Format
                    </div>
                </div>
            </div>
            <div class="ui bulleted list">
                <div class="item">Format for Manual data is same as CSV's data</div>
                <div class="item">Five comma (',') seperated values on each line is the correct format</div>
                <div class="item">See Example below</div>
                <div class="ui segment">
                    <p>Deepjyoti,Mondal,Mentor,FOSSASIA,@djmgit</p>
                    <p>Yash,Ladha,Developer,FOSSASIA,@yashladha</p>
                    <p>Manish,Devgan,Developer,FOSSASIA,@gabru-md</p>
                    <p>Parth,Shandilya,Developer,FOSSASIA,@ParthS007</p>
                </div>
            </div>
        </div>
    </div>
</div>